<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>lineheight和fontsize</title>
    <style>
        .zero{
            font-size: 0;
            line-height: 25px;
            background-color: #cad53d;
        }
        .no-height{
            line-height: 50px;
            background-color: #cccccc;
        }
        .y-line{
            font-size:25px;
            background-color: fuchsia;
        }
        .y-height{
            height:50px;
            background-color: burlywood;
        }
    </style>
</head>
<body>
<p>所以说一个块的高度是由line-height决定的</p>
<p class="zero">可爱xM,</p>
<div class="no-height">可爱，而且只设置lineheight就可以居中</div>
<div class="y-line">可爱,在没有设置line-height：0  时，他的高度是由字体撑开，but当设置line-height为0之后他的高度为6</div>
<div class="y-height">可爱，高度为设置的高度，但是不能自己居中，</div>
</body>
</html>